<template>
	<view class="moreTxt">
		<custom-navi :show-home="false">
			{{moreName}}
		</custom-navi>
		<view class="moreTxt-content">
			<view v-if="moreShow">
				<view class="moreTxt-content-radio" v-for="(item,index) in radioData" :key='index'>
					<radio-group @change="radioChange">
						<label class="radio">
							<radio :value="item.value" :checked='index === current' color="rgba(12, 212, 211, 1)" style="transform:scale(0.6)" /><text>{{item.content}}</text>
						</label>
					</radio-group>
				</view>
			</view>
			<view v-else>
				<view class="moreTxt-content-radio" v-for="(item,index) in couponData" :key='index'>
					<radio-group @change="couponChange">
						<label class="radio">
							<radio :value="item.value" :checked='index === current' color="rgba(12, 212, 211, 1)" style="transform:scale(0.6)" /><text>{{item.content}}</text>
						</label>
					</radio-group>
				</view>
				<!-- <view class="moreTxt-content-radio">
					<radio-group @change="couponChange">
						<label class="radio">
							<radio value="0" :checked='current' color="rgba(12, 212, 211, 1)" style="transform:scale(0.6)" />
							<text></text>
							<input type="text" value="" />
							<text></text>
						</label>
					</radio-group>
				</view> -->
			</view>
		</view>
		<view class="affirmBtn">
			确定
		</view>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				moreName: '测试',
				current: '',
				moreShow: true,
				couponData: [{
						content: '不再与其它优惠同享',
						value: '1'
					},
					{
						content: '可与其它优惠同享',
						value: '2'
					}
				],
				radioData: [{
						content: '全部年龄段',
						checked: true,
						value: '0'
					},
					{
						content: '0~3岁',
						checked: false,
						value: '1'
					},
					{
						content: '3-6岁',
						checked: false,
						value: '2'
					},
					{
						content: '10~18岁',
						checked: false,
						value: '3'
					},
					{
						content: '20~45岁',
						checked: false,
						value: '4'
					},
					{
						content: '50岁以上',
						checked: false,
						value: '5'
					},
				],
			}
		},
		// onUnload () {
		//   uni.$off()
		// },
		onLoad(option) {
			console.log(option.type)
			if (option.type === '0') {
				this.moreName = '可否与其它优惠同享'
				this.moreShow = false
			} else {
				this.moreName = '适用年龄段'
				this.moreShow = true
			}
		},
		onShow(option) {
			// const _self = this
			// uni.getStorage({
			//     key: 'introduce',
			//     success: function (res) {
			//         // console.log(res.data);
			//     }
			// });
		},
		methods: {
			radioChange(evt) {
				for (let i = 0; i < this.radioData.length; i++) {
					if (this.radioData[i].value === evt.target.value) {
						this.current = i;
						break;
					}
				}
			},
			couponChange(evt) {
				for (let i = 0; i < this.couponData.length; i++) {
					if (this.couponData[i].value === evt.target.value) {
						this.current = i;
						break;
					}
				}
			},
		},
	}
</script>
<style>
	page {
		background-color: #ffffff;
	}
</style>
<style lang="scss" scoped>
	.moreTxt {
		&-content {
			padding: 34rpx;

			&-radio {
				margin-bottom: 40rpx;
			}
		}
		.affirmBtn{
			position: absolute;
			bottom: 0rpx;
			left: 0rpx;
			width:749rpx;
			height:88rpx;
			background:rgba(12,212,211,1);
			font-size:34rpx;
			font-family:PingFang SC;
			font-weight:500;
			text-align: center;
			line-height:88rpx;
			color:rgba(255,255,255,1);
			opacity:1;
		}
	}
</style>
